<!DOCTYPE html>

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<link rel="stylesheet" type="text/css" href="style.css">
<title>Captive</title>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>


<script>
	
	$(document).ready(
		function() {
			document.getElementById('audiotag1').play();
			document.getElementById("dialog").style.display="inherit";
			document.getElementById("background").style.display="inherit";
			document.getElementById("dialog").innerHTML = "(Someone knocking on the door)";
			$("#dialog").click(dialog1);
		}
	);
	
	function dialog1()
	{
		document.getElementById("dialog").innerHTML = "I say: <br/>Who's there? Jimmy, is that you? (open the door)";
		$("#dialog").click(dialog2);
	}
	
	function dialog2()
	{
		document.getElementById("peopleimage").src="images/stephen.png";
		document.getElementById("dialog").innerHTML = "Stranger says wickedly: <br/>Hi, do you recognize me?";
		$("#dialog").click(dialog3);
	}
	
	function dialog3()
	{
		document.getElementById("peopleimage").src="images/blank.png";
		document.getElementById("dialog").innerHTML = "I don't recognize his face, but his voice sounds familiar...";
		$("#dialog").click(dialog4);
	}
	
	function dialog4()
	{
		document.getElementById("dialog").innerHTML = "I say: <br/>YOU!! You are the one who kidnapped Jimmy! Tell me where Jimmy is!";
		$("#dialog").click(dialog5);
	}
	
	function dialog5()
	{
		document.getElementById("peopleimage").src="images/stephen.png";
		document.getElementById("dialog").innerHTML = "Stranger says teasingly: <br/>Sorry pal, you are only half right.<br/>Yes, I kidnapped Jimmy, but that's not why I'm here. You see, I know you very, very well, and it would hurt my feelings if you don't recognize me at all.";
		$("#dialog").click(dialog6);
	}
	
	function dialog6()
	{
		document.getElementById("peopleimage").src="images/blank.png";
		document.getElementById("dialog").innerHTML = "I say: <br/>What are you talking about? I don't know you! I don't have time for this! What have you done to Jimmy?";
		$("#dialog").click(dialog7);
	}
	
	function dialog7()
	{
		document.getElementById("peopleimage").src="images/stephen.png";
		document.getElementById("dialog").innerHTML = "Stranger says mockingly: <br/>It doesn't hurt to have a little patient when someone is trying to discuss an important subject with you. No wonder your own son hates you.";
		$("#dialog").click(dialog8);
	}
	
	function dialog8()
	{
		document.getElementById("peopleimage").src="images/blank.png";
		document.getElementById("dialog").innerHTML = "What in the world does he want?";
		$("#dialog").click(dialog9);
	}
	
	function dialog9()
	{
		document.getElementById("peopleimage").src="images/stephen.png";
		document.getElementById("dialog").innerHTML = "Stranger says: <br/>Okay, game's over. I don't have a whole day. (takes out a gun)";
		$("#dialog").click(dialog10);
	}
	
	function dialog10()
	{
		document.getElementById("peopleimage").src="images/blank.png";
		document.getElementById("dialog").innerHTML = "I say: <br/> NO! Don't shoot! Please! I didn't do anything!!";
		$("#dialog").click(dialog11);
	}
	
	function dialog11()
	{
		document.getElementById("peopleimage").src="images/stephen.png";
		document.getElementById("dialog").innerHTML = "Stranger says: <br/> You have done a lot and it's time for you to stop....";
		$("#dialog").click(nextscene);
	}
	
	function nextscene()
	{
		window.location = "inter3.php";
	}
	
</script>



</head>

<body>


<div id="container">
	<div id="background"><img src="images/office.jpg" /></div>
	<div id="dialog">
	</div>
	<div id="people"><img id="peopleimage" src=""></div>
</div>

<audio id="audiotag1" src="audios/door_knock.mp3" preload="auto"></audio>


</body>
</html>